<!--双向数据绑定需引入FormsModule 模块-->
<!--[(ngModel)]   []:表示绑定属性（）:表示绑定事件-->
<h1>表单提交</h1>
<section style="width: 300px">
  <span>{{UserInfo | json}}</span>
</section>
<section>
  姓名：
  <input type="text" [(ngModel)]="UserInfo.name">
</section>
<section>
  <input type="radio" value="1" id="male" [(ngModel)]="UserInfo.sex"> <label for="male">男</label>
  <label><input type="radio" value="2" [(ngModel)]="UserInfo.sex">女</label>
</section>
<section>
  <select name="city" [(ngModel)]="UserInfo.city">
    <option [value]="item" *ngFor="let item of UserInfo.cityList">{{item}}</option>
  </select>
</section>
<section>
  <span *ngFor="let item of UserInfo.hobby;let key=index">
    <input type="checkbox" [id]="'check'+key" [(ngModel)]="item.checked"><label
    [for]="'check'+key">{{item.title}}</label>
  &nbsp;&nbsp;
  </span>
</section>
<section>
  <textarea name="mark" id="" cols="30" rows="10" [(ngModel)]="UserInfo.mark"></textarea>
</section>
<button (click)="getNameVal($event)">获取姓名</button>
